{% block sw_settings_tax_provider_sorting_modal %}
<sw-modal
    class="sw-settings-tax-provider-sorting-modal"
    :title="$tc('sw-settings-tax.list.taxProvider.sorting-modal.modalTitle')"
    @modal-close="closeModal"
>
    <template #body>
        <div class="sw-modal__body sw-settings-tax-provider-sorting-modal__subtitle">
            {{ $tc('sw-settings-tax.list.taxProvider.sorting-modal.subTitle') }}
        </div>

        <div class="sw-modal__body">
            <sw-sortable-list
                class="sw-settings-tax-provider-sorting-modal__tax-provider-list"
                :items="sortedTaxProviders"
                @items-sorted="onSort"
            >
                <template #item="{ item: taxProvider }">
                    <div
                        class="sw-settings-tax-provider-sorting-modal__tax-provider-list-item"
                        :class="!taxProvider.active ? 'is--disabled' : ''"
                    >
                        <mt-icon
                            class="sw-settings-tax-provider-sorting-modal__tax-provider-list-item__action"
                            name="regular-grip-vertical"
                        />

                        <div class="sw-settings-tax-provider-sorting-modal__tax-provider-list-item__name">
                            {{ taxProvider.translated.name }}
                        </div>
                    </div>
                </template>
            </sw-sortable-list>
        </div>
    </template>

    <template #modal-footer>
        <mt-button
            class="sw-settings-tax-provider-sorting-modal__cancel-button"
            variant="secondary"
            @click="closeModal"
        >
            {{ $tc('global.default.cancel') }}
        </mt-button>

        <sw-button-process
            class="sw-settings-tax-provider-sorting-modal__save-button"
            variant="primary"
            :is-loading="isSaving"
            :disabled="!acl.can('tax.editor')"
            :process-success="false"
            @click="applyChanges"
        >
            {{ $tc('global.default.save') }}
        </sw-button-process>
    </template>
</sw-modal>
{% endblock %}
